<template>
    <sky-base-page ref="skyBasePageRef" padding="24rpx 0 0" bg-page-color="#f5f5f5">
        <view>
            
            <up-card :show-head="false" margin="0 24rpx">
                <template #body>
                    <up-input v-model="form.shop_name" placeholder="请输入自提点名称" border="bottom">
                        <template #prefix>
                            自提点
                        </template>
                    </up-input>
                    <up-gap></up-gap>
                    <up-input v-model="form.mobile" placeholder="请输入手机号" border="bottom">
                        <template #prefix>
                            手机号
                        </template>
                    </up-input>
                    <up-gap></up-gap>
                    <up-input v-model="form.address" placeholder="请输入详细地址" type="textarea" border="bottom">
                        <template #prefix>
                            详细地址
                        </template>
                        <template #suffix>
                            <up-icon name="map" color="#b07f63" size="24" @tap="chooseLocation"></up-icon>
                        </template>
                    </up-input>
                </template>
            
            </up-card>
        </view>
        
        <template #footer>
            <up-button type="primary" shape="circle" color="#b07f63" text="新增地址"
                       @tap="confirm"></up-button>
        </template>
    </sky-base-page>
</template>
<script setup>

const skyBasePageRef = ref()

const form = ref({
    shop_name: '',
    mobile: '',
    address: '',
    longitude: '',
    latitude: '',
})

const chooseLocation = () => {
    uni.chooseLocation({
        success: function (res) {
            form.value.longitude = res.longitude
            form.value.latitude = res.latitude
            form.value.address = res.name + res.address
        }
    });
}

// 确认添加
const confirm = async () => {
    const data = qly.tool.deepCopy(form.value)
    
    let res = null
    if (data.id) {
        res = await qly.api.user.pickup_point.edit(data)
    } else {
        res = await qly.api.user.pickup_point.add(data)
    }
    if (res.code === 1) {
        uni.navigateBack()
        uni.$emit('pointRefresh')
        qly.dialog.success(data.id ? '修改成功' : '添加成功').catch()
    } else {
        qly.dialog.apiError(res).catch()
    }
}

// 获取地址信息
const getAddressInfo = async () => {
    const res = await qly.api.user.pickup_point.info({id: qly.page.params.id})
    if (res.code === 1) {
        form.value = {
            id: res.data.id,
            shop_name: res.data.shop_name,
            mobile: res.data.mobile,
            address: res.data.address,
            longitude: res.data.longitude,
            latitude: res.data.latitude,
        }
    } else {
        qly.dialog.apiError(res).catch()
    }
}
qly.page.onLoad(() => {
    if (qly.page.params.id) {
        getAddressInfo()
    }
})
</script>
<style scoped lang="scss">
.search-box {
    padding: 24rpx;
    box-sizing: border-box;
    background-color: #fff;
}
</style>
